//加载公共控制
function SetCommonControl(){
	SetThemeControl();   //控制主题切换控制
	SetNavControl();   //二级菜单开关控制
	SetLeftNavControl();  //左侧二级菜单控制
}

//左侧二级菜单控制
function SetLeftNavControl(){
	$("#leftNavList>.curr").find("ul").each(function(){
		$(this).css("height",($(this).find("li").size()*30)+"px");
	});
	$("#leftNavList>li>span").on("click",function(){
		if($(this).parent().hasClass("curr")){
			$(this).parent().removeClass("curr");
			$(this).next().css("height","0");
		}else{
			$(this).parent().addClass("curr");
			var $size=$("li",$(this).next()).size();
			$(this).next().css("height",($size*30)+"px");
		}
	});
}

//二级菜单开关控制
function SetNavControl(){
	var $navControlWidth=15;
	$("#topLeftMenu>a").each(function(){$navControlWidth+=$(this).outerWidth(true);});
	$("#navControl,#menuOpen").on("click",function(){
		if($(this).hasClass("open")){
			$("#navControl,#menuOpen").removeClass("open");
			$("#topLeftMenu").css({width:0});
		}else{
			$("#navControl,#menuOpen").addClass("open");
			$("#topLeftMenu").css({width:$navControlWidth});
		}
	});
}

//控制主题切换控制
function SetThemeControl(){
	var checkTheme=getCookie("themeSet");
	if(!checkTheme || checkTheme==null || checkTheme==""){
		checkTheme=$("#topRightMenu>b").eq(0).attr("for");
		$("#topRightMenu>b").removeClass("currtheme");
		$("#topRightMenu>b").eq(0).addClass("currtheme");
	}else{
		$("#topRightMenu>b").removeClass("currtheme");
		$("[for='"+checkTheme+"']",$("#topRightMenu")).addClass("currtheme");
	}
	$("body").removeClass().addClass(checkTheme);
	$("#topRightMenu>b").on("click",function(){
		if($(this).hasClass("currtheme")) return;
		var getTheme=$(this).attr("for");
		if(!getTheme) return;
		setCookie("themeSet",getTheme);
		$("#topRightMenu>b").removeClass("currtheme");
		$(this).addClass("currtheme");
		$("body").removeClass().addClass(getTheme);
	});
}


//展示竖直图表
function SetVerticleChart(){
	var barChartData = {
		labels: ['数1', '数2', '数3', '数4', '数5', '数6'],
		datasets: [{
			label: '第一组数',
			backgroundColor: [
                'rgba(46, 220, 246, 0.3)',
                'rgba(46, 220, 246, 0.6)',
                'rgba(46, 220, 246, 1)',
                'rgba(0, 168, 193, 0.5)',
                'rgba(0, 168, 193, 0.7)',
                'rgba(0, 168, 193, 1)'
            ],
			borderColor: 'rgba(0,134,134,0.5)',
			borderWidth: 1,
			data: [123,53,66,300,178,44]
		}]

	};
	new Chart('canvasVerticle', {
		type: 'bar',
		data: barChartData,
		options: {
			responsive: true,
			legend: {position: 'top',},
			title: {display: true,text: '竖直图表示例'}
		}
	});
}

//展示线条图表
function SetLineChart(){
	new Chart('canvasLine', {
		type: 'line',
		data: {
			labels: ['数1', '数2', '数3', '数4', '数5', '数6'],
			datasets: [{
				backgroundColor: 'rgba(46,220,246,0.5)',
				borderColor: 'rgba(0,134,134,0.5)',
				data: [123,53,66,300,178,44],
				label: '第一组数',
				fill: 'start'
			}]
		},
		options: {
			title: {
				text: '展示线条图表',
				display: true
			},
			maintainAspectRatio: false,
			spanGaps: false,
			elements: {
				line: {
					tension: 0.000001
				}
			},
			plugins: {
				filler: {
					propagate: false
				}
			},
			scales: {
				xAxes: [{
					ticks: {
						autoSkip: false,
						maxRotation: 0
					}
				}]
			}
		}
	});
};

//展示饼状图表
function SetPieChart(){
	var barChartData = {
		labels: ['数1', '数2', '数3', '数4', '数5', '数6'],
		datasets: [{
			label: '第一组数',
			backgroundColor: [
                'rgba(46, 220, 246, 0.3)',
                'rgba(46, 220, 246, 0.6)',
                'rgba(46, 220, 246, 1)',
                'rgba(0, 168, 193, 0.5)',
                'rgba(0, 168, 193, 0.7)',
                'rgba(0, 168, 193, 1)'
            ],
			borderColor: 'rgba(255,255,255,1)',
			borderWidth: 3,
			data: [123,53,66,300,178,44]
		}]

	};
	new Chart('canvasPie', {
		type: 'pie',
		data: barChartData,
		options: {
			responsive: true,
			legend: {position: 'top',},
			title: {display: true,text: '展示饼状图表'}
		}
	});
};


//展示多线条图表
function SetMutiLineChart(){
	var config = {
			type: 'line',
			data: {
				labels: ['一月','二月','三月','四月','五月','六月'],
				datasets: [{
					label: '曝光量',
					backgroundColor: 'rgba(46,220,246,0.5)',
					borderColor: 'rgba(0,134,134,0.5)',
					fill: false,
					data: [123,53,66,300,178,44],
				}, {
					label: '活跃数',
					backgroundColor: 'rgba(27,185,127,0.5)',
					borderColor: 'rgba(0,136,87,0.5)',
					fill: false,
					data: [300,178,44,123,53,66],
				}, {
					label: '用户数',
					backgroundColor: 'rgba(102,0,127,0.5)',
					borderColor: 'rgba(181,63,211,0.5)',
					fill: false,
					data: [178,44,123,53,66,300],
				}]
			},
			options: {
				title: {
					text: '多线条展示'
				},
				scales: {
					yAxes: [{
						scaleLabel: {
							display: true,
							labelString: '数量'
						}
					}]
				},
			}
		};
		new Chart('canvasMutiLine', config);
}


//写cookies
function setCookie(c_name,value,expiredays){
	var exdate=new Date();
	exdate.setDate(exdate.getDate()+expiredays);
	document.cookie=c_name+ "=" +escape(value)+((expiredays==null) ? "" : ";expires="+exdate.toGMTString());
}
//读cookies
function getCookie(c_name){
	if (document.cookie.length>0){
		c_start=document.cookie.indexOf(c_name + "=");
		if (c_start!=-1){ 
			c_start=c_start + c_name.length+1 ;
			c_end=document.cookie.indexOf(";",c_start);
			if (c_end==-1) c_end=document.cookie.length;
			return unescape(document.cookie.substring(c_start,c_end));
		}
	}
	return ""
}